<template>
  <div :style="nodeData.style" @mousedown="handleMouseDown" class="box">
    <div
      id="adapter-box"
      :style="{
        backgroundColor: nodeData.currentStyle.fill,
        border: `${nodeData.currentStyle.strokeWidth}px ${nodeData.currentStyle.strokeType} ${nodeData.currentStyle.stroke}`,
        cursor: `${nodeData.currentStyle.cursor}`,
        borderRadius: '50%',
      }"
    ></div>
  </div>
</template>
<script>
import mixin from "../mixin";
export default {
  name: "AdapterCom",
  mixins: [mixin],

  data() {
    return {
      keepProportions: true,
      nodeData: {
        shape: "AdapterCom", //节点名称，不能重复,必须要跟组件名称一致，不然找不到组件导入
        // 普遍样式
        textEdit: false,
        currentStyle: {
          fill: "#a3a3a3",
          stroke: "#000",
          strokeWidth: 2,
          strokeType: "solid",
          cursor: "move",
        },
        isDropEnd: false,
        width: 100,
        height: 100,
        // 其他样式
        style: {},
        // 节点属性
        adapter: true,
        createNodeDescribe: false,
      },
    };
  },
  mounted() {},
  methods: {
    createPort() {},
  },
};
</script>
<style scoped lang="less">
.box {
  width: 100%;
  height: 100%;
  cursor: move;
  #adapter-box {
    width: 100%;
    height: 100%;
    border-radius: 50%;
  }
}
</style>
